import { Component, OnInit, ViewChild } from '@angular/core';

@Component({
  selector: 'app-transition',
  templateUrl: './transition.component.html',
  styleUrls: ['./transition.component.less']
})
export class TransitionComponent implements OnInit {

  @ViewChild('aside') aside: any
  public asideFlag: boolean = false

  constructor() { }

  ngOnInit(): void {
  }

  ngAfterViewInit(): void {
    //Called after ngAfterContentInit when the component's view has been initialized. Applies to components only.
    //Add 'implements AfterViewInit' to the class.
    console.log('this.aside---' ,this.aside)
  }

  showAside() {
    if (this.asideFlag) {
      this.aside.nativeElement.style.transform = 'translateX(100%)'
      this.asideFlag = false
    } else {
      this.aside.nativeElement.style.transform = 'translateX(0)'
      this.asideFlag = true
    }
  }

}
